<template>
	<view class="content">
		<view class="uni-padding-wrap uni-common-mt">
			<view style="width: 100%;">
				<video class="videobox" id="myVideo" :src="src" controls>
				</video>
			</view>
			<view>
				<uni-segmented-control :current="current" :values="items" @clickItem="onClickItem" styleType="text"
					activeColor="#4cd964"></uni-segmented-control>
				<view class="content">
					<view style="margin-top: 40rpx;" v-show="current === 0">
						<view class="content2">
							<comment :comments="comments" :nameArr="nameArr" :sectionResourceId="sectionResourceId" v-model="commentText"
								@lower="lower" @reply="reply" @commentlists="commentlists"></comment>
						</view>
					</view>
					<view style="margin-top: 40rpx;" v-show="current === 1">
						<text style="color: #808080;">暂无数据</text>
					</view>
					<view style="margin-top: 40rpx;" v-show="current === 2">
						<text style="color: #808080;">暂无数据</text>
					</view>
					<view style="margin-top: 40rpx;" v-show="current === 3">
						<text style="color: #808080;">暂无数据</text>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import Comment from '@/components/comment/comment.vue';
	export default {
		components: {
			Comment
		},
		data() {
			return {
				src: '',
				items: ['评价', '问答', '笔记', '纠错'],
				current: 0,
				student_name: '',
				isLongin: false,
				student_access_token: '',
				sectionResourceId: '',
				comments: [],
				commentText: '',
				nameArr:[]
			}
		},
		onLoad(option) {
			this.src = "https://tveti.lcvc.edu.cn/" + option.fileUrl;
			// this.src = "http://localhost:8071/" + option.fileUrl;
			this.commentlists(option.sectionResourceId);
			this.sectionResourceId = option.sectionResourceId;
		},
		methods: {
			onClickItem(e) {
				if (this.current !== e.currentIndex) {
					this.current = e.currentIndex
				}
			},
			// 评论区删除按钮的显示判断
			// is_Delete() {
			// 	let comName = uni.getStorageSync("username");
			// 	console.log("comName:"+comName);
			// 	let msgName = this.nameArr;
			// 	for(let i=0;i<msgName.length;i++) {
			// 		console.log("msgName"+i+": "+msgName[i]);
			// 		if (comName != msgName[i]) {
			// 			this.isDelete = false
			// 		} else {
			// 			this.isDelete = true
			// 		}
			// 	}
				
			// },
			// 请求接口评论数据
			async commentlists(id) {
				let token = uni.getStorageSync('student_access_token');
				console.log(id)
				if (token == '' || token == null) {
					this.isLongin = false
				} else {
					let res = await this.$myRequest({
						url: '/api/mobile/schoolstudent/schoolCourseSectionResourceComment?sectionResourceId='+id,
						// data: {
						// 	sectionResourceId: id,
						// },
					})
					const name = res.data.data;
					console.log(name)
					for(let i=0;i<name.length;i++) {
						console.log(name[i].sysUser.nickName)
						// 装入数组的数据
						// console.log("评论内容的id"+[i]+": "+name[i].id);
						this.nameArr.push(name[i].sysUser.nickName)
						console.log(this.nameArr)
					}
					// console.log(res.data.data[1].schoolStudent.name)
					for(let k=0;k<this.nameArr.length;k++) {
						// console.log(this.nameArr[k])
						// 装入数组的数
					}
					// this.is_Delete();
					// console.log(res);
					this.comments = res.data.data
					console.log(this.comments)
					// console.log('拿到名字：'+JSON.stringify(this.comments[0].schoolStudent.name));
					// console.log('拿评论的内容: '+this.comments[0].content);
					// console.log('最后的结果：'+JSON.stringify(res.data.data[0].schoolStudent.name));
				}

			},
			
			lower() {
				console.log('到底了');
			},
			// 点击回复触发事件
			reply(index, id, userNickName, layer, reply) {
				console.log(index, id, userNickName, layer, reply);
			}
		}
	}
</script>

<style lang="scss" scoped>
	.videobox {
		width: 100%;
		object-fit: fill;
	}

	.content {
		width: 100%;
	}

	.content2 {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		width: 100%;
	}

	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 200rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.text-area {
		display: flex;
		justify-content: center;
	}

	.title {
		font-size: 36rpx;
		color: #8f8f94;
	}
</style>
